/**
 * 配置页面访问权限
 * 使用路由导航守卫
 * 需求：所有的页面都需要登入后访问
 * 解决：判断token是否存在
*/

import router from '@/router/index'
import store from '@/store/index'

// 导航守卫：全局前置守卫（页面跳转之前触发的函数）
// beforEach((to,from,next)=>{})
// to:目标路由对象
// from:当前路由对象 默认/
// next():放行函数

router.beforeEach(async(to, from, next) => {
  // console.log(store.state.user.token)
  // console.log(store.getters.token)
  if (store.state.user.token) {
    // 优化:当用户登入成功后,不允许访问登入页面
    // 直接跳转主页即可
    if (to.path === '/login') {
      next('/')
    } else {
      // 用户信息不存在，重新获取用户信息
      // 只能在这里获取用户资料，因此数据需要全局使用，如果写在某个组件created()
      // 然后再次跳转到其他页面，当用户去到其他页面再刷新浏览器的时候就请求不
      // 到数据了，所以需要把获取用户资料的代码放到导航守卫中
      // 增加判断限制非必须请求
      // 判断可以使用userInfo中固定的属性
      if (!store.state.user.userInfo.userId) {
        await store.dispatch('user/getUserInfo')
        // 调用筛选具有访问权限路由的方法
        // 调用模块中actions函数的语法：store.dispacth('模块名/函数名', 参数))
        const newRoutes = await store.dispatch('permission/filterRoutes', store.state.user.userInfo.roles.menus)
        // 把筛选出来的具有权限的动态路由添加到路由规则中，则可以恢复路由的访问功能了
        // addRoutes 属于router的方法
        router.addRoutes([...newRoutes, { path: '*', redirect: '/404', hidden: true }])
        next(to.path)
      }
      next()
    }
  } else {
    // 设置放行白名单
    const whiteArr = ['/login', '/404']
    if (whiteArr.includes(to.path)) {
      next()
    } else {
    // 非白名单跳转到登入页面
      next('/login')
    }
  }
})

